<!doctype html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
		<meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
		<link rel="stylesheet" type="text/css" href="../../css/api.css" />
		<link rel="stylesheet" type="text/css" href="../../css/style.css" />
		<style>
			.display-none { visibility:hidden; }
		</style>
	</head>
	<body>
		<div class="header header_01" id="header">
			<div class="wrapper">
				<div class="h_s_form">
					<div class="m_cell_hd m_cell_primary"><input type="text" id="keyword" name="keyword" value="" placeholder="请输入目的地" /></div>
					<div class="m_cell_ft"><button tapmode onclick="closeSearchMode();">取消</button></div>
				</div>
			</div>
		</div>
	</body>
	<script type="text/javascript" src="../../script/api.js" ></script>
	<script type="text/javascript">
		var UIInput;
		var keyOpened = 1; //键盘是否弹出
		var keyboardId = 0;//当前键盘ID
		apiready = function() {
			api.parseTapmode();
			var header = $api.byId('header');
			$api.fixStatusBar(header);
			var headerPos = $api.offset(header);
			var body_h = $api.offset($api.dom('body')).h;
			api.openFrame({
				name: 'search_frm',
				url: 'search_frm.html',
				bounces: false,
				rect: {
					x: 0,
					y: headerPos.h,
					w: 'auto',
					h: 'auto'
				},
				pageParam: {
					keyboardId: keyboardId
				}
			});
			api.addEventListener({
				name:'clickinput'
			}, function(ret, err){    
				api.bringFrameToFront({
					from: 'search_frm',
					to: ''
				});
				//api.closeFrame({
					//name: 'result_frm'
				//});
				//api.closeFrame({
					//name: 'allresult_frm'
				//});
			});
			var keyword = $api.byId('keyword');
			var rect = $api.offset(keyword);
			UIInput = api.require('UIInput');
			UIInput.open({
				rect: {
					x: rect.l+35,
					y: rect.t+1,
					w: rect.w-60,
					h: rect.h-1
				},
				styles: {
					bgColor: '#F2F3F5',
					size: 14,
					color: '#333',
					placeholder: {
						color: '#999'
					}
				},
				autoFocus: true,
				maxRows: 1,
				placeholder: '请输入目的地',
				keyboardType: 'search',
				fixedOn: api.frameName
			}, function(ret) {
				if (ret) {
					keyboardId = ret.id;
					UIInput.addEventListener({
						id: keyboardId,
						name : 'becomeFirstResponder'
					}, function() {
						//获得焦点将搜索历史显示出来
						api.sendEvent({
							name : 'clickinput'
						});
						//api.setFrameAttr({
							//name: 'result_frm',
							//hidden: true
						//});
					});
					if (ret.eventType == 'show') {
						keyboardId = ret.id;
						setTimeout(function(){
							api.execScript({
								frameName : 'search_frm',
								script : "setInputid('" + keyboardId + "');"
							});
						}, 500);
						
					} else if (ret.eventType == 'search') {//点击键盘上的搜索按钮
						search();//搜索
						hideInput();//收起键盘
					} else if (ret.eventType == 'change') {
						if(ret.msg != '')
						{
							//alert(1);
							$api.removeCls($api.byId('clearbtn1'),'display-none');
						}
						else
						{
							//alert(2);
							$api.addCls($api.byId('clearbtn1'),'display-none');
						}
					}
					
				}
			});
			
		
			
		}
		//点击搜索
		function search() {
			//获取表单的值
			UIInput.value({
				id : keyboardId,
			}, function(ret, err) {
				if (ret.status) {
					var msg = $api.trimAll(ret.msg);//清除字符串中空格
					if(msg=='')
					{
						api.toast({
							msg : '请输入关键字',
							global : true
						});
						return false;
					}
					//储存搜索记录
					api.execScript({
						frameName : 'search_frm',
						script : "Savesearchrecord('" + msg + "');"
					});
					//执行搜索
					Performsearch(msg);
				} else {
					alert(JSON.stringify(err));
				}
			});
		};
		//执行搜索
		function Performsearch(record) {
			//页面执行搜索
			//api.toast({
				//msg : '你搜索了' + record,
				//global : true
			//});
			var header = $api.byId('header');
			var headerPos = $api.offset(header);
			var body_h = $api.offset($api.dom('body')).h;
			api.openFrame({
				name: 'result_frm',
				url: 'result_frm.html',
				bounces: false,
				rect: {
					x: 0,
					y: headerPos.h,
					w: 'auto',
					h: 'auto'
				},
				pageParam: {
					keyword: record,
					headerH: headerPos.h
				}
			});
		};
		function closeSearchMode() {
			//退出搜索模式
			if(keyOpened == 1)
			{
				hideInput();
			}
			else
			{
				closeWin();
			}
			//var header = $api.byId('header');
			//$api.fixStatusBar(header);
		}
		function hideInput(){
			//隐藏键盘
			keyOpened = 0;
			UIInput.closeKeyboard({
				id: keyboardId
			});
		}
		//历史记录快捷搜索
		function kuaijieSearch(msg,inputid) {
			//alert(inputid);
			UIInput.value({
				id: inputid,
				msg: msg
			});

			Performsearch(msg);//搜索
			keyOpened = 0;
			UIInput.closeKeyboard({
				id: inputid
			});
		}
		function closeWin(){
			api.closeWin({
			});
		}
	</script>
</html>
